.swiper {
    height: 160px;
// margin: 4px 10px;
border-radius: 4px;
overflow: hidden;
.swiper-wrapper{
    width: 100%t;
    height: 100%;
}

.swiper-slide-active{
    // transform: scale(1) !important;
    width: 100%;
  }
.swiper-slide{
    //  width: 300px !important;
    //  margin:0px  20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    transition: 300ms;
    // transform: scale(0.8);
}
    img {
        width: 100%;
        height: 100%;
    }
    .swiper-pagination{
        span{
            width: 30px;
            border-radius: 2px;
            height: 5px;
            background-color: rgba(255, 255, 255, 0.9) ;
        }
        .swiper-pagination-bullet-active{
            background-color: #fff ;
        }
    }
    
}
.scrollTab{
    overflow: hidden;
    display: flex;
    gap: 10px;
     padding: 10px ;
    .LeftName::-webkit-scrollbar{display: none;}
    .tabActive{
        background: linear-gradient(180deg, #f4ba1e, #c30d10);
    }
    .LeftName{
        height: calc(100vh - 300px);
        overflow-y: scroll;
        padding-bottom: 60px;
        >div{ 
       margin-bottom: 10px;
            width:60px;
            height: 60px;
            background-color: #2e3035;
            border-radius: 4px;
            display: flex;
            justify-content: center;
            flex-direction: column;
            align-items: center;
            p{
                margin: 0;
                font-size: 13px;
                color: #fff;
                white-space:nowrap;
            }
            img{
                width: 30px;
                height: 30px;
                object-fit: scale-down;
            }
        }
       
    }
}